<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script src="../../js/vue.js"></script>
</head>
<body>
<!--v-once指令
  在节点初次渲染之后,就视为静态内容
  以后数据的改变不会引起v-once所在结构的更新,可用于优化性能


-->
  <div id="root">
    n的初始值:<h2 v-once>{{n}}</h2>
    n的值:<h2>{{n}}</h2>
    <button @click="n++">点击n+1</button>
  </div>

  <script type="text/javascript">
    var vm = new Vue({
      el:'#root',
      data:{
        n:1
      }
    });
  </script>
</body>
</html>
